<template>
  <view class="login_content">
    <view class="text">
      Hello<br />
      欢迎使用MyDraw
    </view>


    <u-button type="primary" size="large" class="custom-style" icon="weixin-fill" text="微信一键登录/注册" color="#1AAD19"
      @click="loginHandel()"></u-button>

    <u-button type="primary" size="large" text="暂不登录" @click="notLogin()"></u-button>

    <u-toast ref="uToast"></u-toast>
  </view>
</template>

<script>
import { login } from '@/api/api.js'
import { setToken } from '@/utils/auth'
export default {
  data() {
    return {
      userInfo: {},
      rules: [],
    }
  },
  onLoad() {

  },
  methods: {
    loginHandel() {
      const that = this
      uni.login({
        "provider": "weixin",
        "onlyAuthorize": true, // 微信登录仅请求授权认证
        success: function (event) {
          login({ code: event.code }).then(res => {
            if (res.code == 200) {
              if (res.data.register) {
                that.$refs.uToast.show({
                  type: 'success',
                  message: "登录成功",
                })
                setToken(res.data.token)
                setTimeout(() => {
                  uni.switchTab({
                    url: '/pages/index/index'/*  */
                  })
                }, 200)
              } else {
                setToken(res.data.token)
                uni.redirectTo({
                  url: '/pages/register/register'
                })
              }

            }
          })
        },
        fail: function (err) {
          // 登录授权失败
          // err.code是错误码
          that.$refs.uToast.show({
            type: 'error',
            message: err,
          })

        }
      })

    },
    registerHandel() {
      uni.navigateTo({
        url: '/pages/register/register'
      });
    },
    notLogin() {
      uni.switchTab({
        url: '/pages/index/index'/*  */
      })
    },
  }
}
</script>

<style lang="scss" scoped>
.login_content {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;

  .text {
    height: 150rpx;
    width: 500rpx;
    font-size: 50rpx;
    font-weight: 800;
    color: #1d1d1d;
    margin: 100rpx auto 0 auto;
  }
}

::v-deep .u-form {
  width: 600rpx;
}

::v-deep .u-button {
  width: 500rpx !important;
  margin: 20rpx 0;
}

.custom-style {
  font-size: 20px;
}
</style>
